/*
@author: user
@date: 2022/6/7 10:30
@Version: 1.0
@last modifined by : 2022/6/7 10:30
@last Modifined time : 2022/6/7 10:30
*/

import React, { Suspense, lazy } from 'react';
import { Spin } from 'antd';
import './asyncRopute.less';

/**
 * 通用的按需加载组件的方法
 * 使用如下
 *  const HelloWorld = AsyncComponent(() => import('Components/test/HelloWorld'));
 */

export const BeforeRendering = () => <div className="async-router-wrap"><Spin tip="Loding..." size="large"/></div>;

const AsyncComponent = (asyncImport) => {
  const Component = lazy(asyncImport);

  // eslint-disable-next-line react/display-name
  return (props) => (
    <Suspense fallback={<BeforeRendering />}>
      <Component {...props} />
    </Suspense>
  )
}

export default AsyncComponent;
